<template>
	<div class="footer">
		<div class="w-info">
			<div class="ljy520 art-count">
				<label>
					<Icon type="ios-create" />
					版本更新：2020年08月09日
				</label>
				<label>
					<Icon type="ios-clock" />
					运行天数：{{ runDate }}天
				</label>
				<label>
					<Icon type="md-contact" />
					访问次数：{{ count.accessSum || 0 }}次
				</label>
			</div>
			<div class=" ljy520">
				<label>
					<Icon type="ios-paper" />
					文章总数：{{ count.articleSum || 0 }}篇
				</label>
				<label>
					<Icon type="md-pricetags" />
					标签总数：{{ count.tagSum || 0 }}个
				</label>
				<label>
					<Icon type="ios-folder-open" />
					分类总数：{{ count.categorySum || 0 }}个
				</label>
			</div>
			<div class="ypy">
				<a href="https://www.upyun.com/" target="_blank">
					<span>又拍云图片存储服务</span>
					<img src="https://s1.ax1x.com/2020/03/15/83fYDS.png" class="img-logo" />
				</a>
			</div>
		</div>
		<div class="copyright">
			<p>
				<a href="http://www.beian.miit.gov.cn/" target="_blank">湘ICP备17023371号</a>
				· 版权所有 © 2018 - 2020
			</p>
		</div>
	</div>
</template>

<script>
import { getCount } from '@/api/count';
import { add } from '@/api/accessLog';
export default {
	name: 'Footer',
	props: {},
	data: () => {
		return {
			count: {}
		};
	},
	methods: {
		getCountData() {
			getCount().then(res => {
				this.count = res.data;
			});
		},
		addAccessLog() {
			add();
		}
	},
	created() {
		this.getCountData();
		this.addAccessLog();
	},
	computed: {
		runDate() {
			return Math.round((new Date().getTime()-new Date('2020-03-14').getTime())/1000/3600/24);
		}
	}
};
</script>

<style lang="stylus" scoped>
.footer
	width 100%
	max-width 1200px
	margin 15px auto
	text-align center
	border-radius 10px
	box-shadow 0 0 0 1px rgba(0, 0, 0, 0.009), 0 2px 15px rgba(0, 0, 0, 0.02)
	margin-bottom 20px
	overflow hidden
	font-size 12px
	.w-info
		background #fff
		padding 20px 0 8px
		.ljy520
			label
				padding-left 15px
				.ivu-icon
					padding-right 3px
		.art-count
			padding-bottom 8px
	.copyright
		background rgba(202, 216, 226, 0.24)
		color #909090
		font-size 12px
		border-top 1px solid #d9e3ea
		padding 15px
		a
			color #909090
	.ypy
		display flex
		justify-content center
		a
			display flex
			justify-content center
			align-items center
			width 200px
			span
				color #696969
		.img-logo
			height 30px
</style>
